.mycard {
  display: flex;
  width: 100%;
  height: 100%;
  border: 1px solid #ebeef5;
  .left {
    width: 320px;
    height: 100%;
    overflow-y: auto;
    background: #fff;
    .item {
      padding: 20px;
      .label {
        padding-bottom: 10px;
        font-weight: bold;
        font-size: 14px;
      }
      .data {
        display: flex;
        flex-wrap: wrap;
        .itemInput {
          display: flex;
          justify-content: center;
          width: calc(50% - 20px);
          margin: 10px;
          padding: 6px 0;
          color: #606266;
          font-size: 14px;
          background: #ebeef5;
          cursor: pointer;
        }
      }
    }
  }
  .center {
    width: calc(100% - 600px);
    overflow-y: auto;
    background: #eee;
    border: dashed 1px #606266;
    .active {
      border: #409eff solid 2px !important;
    }
    .module {
      position: relative;
      margin: 10px;
      padding: 25px 10px;
      background: #fff;
      border: dashed 1px #606266;
      .idText {
        position: absolute;
        top: 2px;
        right: 10px;
        z-index: 99;
        color: #409eff;
        font-size: 12px;
      }
      .delete {
        position: absolute;
        right: 0;
        bottom: 0;
        padding: 0 10px;
        color: #fff;
        background-color: #409eff;
        border-top-left-radius: 10px;
      }
      .inputValue {
        display: flex;
        align-items: center;
        .moduleLabel {
          width: 100px;
          padding-right: 10px;
        }
        .moduleValue {
          width: calc(100% - 100px);
        }
      }
    }
  }
  .right {
    width: 280px;
    padding: 20px;
    overflow-y: auto;
    background: #fff;
    .label {
      padding-bottom: 10px;
      font-weight: bold;
      font-size: 14px;
    }
    .data {
      .item {
        padding-bottom: 10px;
        .labelText {
          font-size: 14px;
        }
      }
    }
  }
}
